<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<link rel="stylesheet" href="layui/css/layui.css">
</head>
<body>
<div class="layui-fluid">
  <table class="layui-hide" id="empInfo" lay-filter="empInfo"></table>
</div>
<!-- 
<script id="toolbar"  type="text/html">

    <button class="layui-btn layui-btn-sm" lay-event="getCheckLength">获取选中数目</button>
    <button class="layui-btn layui-btn-sm" lay-event="isAll">验证是否全选</button>
    <button class="layui-btn layui-btn-sm" lay-event="add">添加请假记录</button>
     <div class="layui-inline">
     <div class="layui-input-inline" style="width:100px;height:38px;">
       <input type="text" name="likeEmpNo" id="likeEmpNo" required lay-verify="required" placeholder="请输入日期" class="layui-input">
     </div>
     
     <div class="layui-inline">
       <button class="layui-btn layui-btn-sm"  data-type="reload" id="search"><i class="layui-icon">&#xe615;</i>搜索</button>
     </div>  
    </div>
</script>

 -->
<script src="layui/layui.js"></script> 
<script th:inline="none">
  layui.use('table',function(){
	  var table=layui.table;
	  var $=layui.jquery;
	  table.render({
		  elem:'#empInfo',
		  url:'/getMyVacate',
		  method:'post',
		  toolbar:'#toolbar',
		  defaultToolbar:['filter','exports','print',{title:'提示',layEvent:'LAYTABLE_TIPS',icon:'layui-icon-tips'}],
		  title:'员工信息表',
		  cols:[[
		    	 {type:'checkbox',fixed:'left'},
		    	 {field:'id',title:'ID',width:80,fixed:'left',unresize:true,sort:true}
		    	 ,{field:'empNo',title:'工号',width:120,sort:true}
		    	 ,{field:'userName', title:'姓名',width:120,sort: true}
		    	 ,{field:'type', title:'请假类型',width:120}
		    	 ,{field:'starTime', title:'开始时间'}		    	
		    	 ,{field:'endTime', title:'结束时间'}	
		    	 ,{field:'status',title:'状态',sort:true,templet:function(d){
		    		 if(d.status==1){
		    			 return '<span style="color:#008000;">' + '已批准' + '</span>'
		    		 }
		    		 if(d.status==0){
		    			 return '<span style="color:#F44336;">' + '未批准' + '</span>'
		    		 }
		    	 }}
		    	
		     ]],
		     id:'testreload',
		     page:true
	  });
	  

	  //表格数据重载
	  var active={
			  reload:function(){
				  var likeEmpNo=$('#likeEmpNo');
				//  var likeDate=$('#likeDate');
				  table.reload('testreload',{
					  page:{
						  curr:1
					  },
					  where:{
						  //参数name的名称要与控制器中的一致
						  empNo:likeEmpNo.val(),
					  },
					  url:'/searchVacateByKeyWord',
					  method:'post'
				  });
			  }
	  };
	  
	  //搜索按钮事件
	  
	  $("#search").on('click',function(){
		  var type=$(this).data('type');
		  active[type]?active[type].call(this):'';
	  });
	  
	  
	  //头部工具栏
	  table.on('toolbar(empInfo)',function(obj){
		  var checkStatus=table.checkStatus(obj.config.id);
		  switch(obj.event){
		  case 'LAYTABLE_TIPS':
			  layer.alert('这是工具栏右侧自定义的一个图标按钮');
		  break;
		  };
	  });
	  
	 
  });
</script>
</body>
</html>